//激活
$color-active: rgba(37, 131, 244, 0.26);
//App主体系
$color-theme: #29C352;
//背景
$color-background: #f4f4f4;
//红色
$color-red: #b62639;
//留白
$color-white: #ffffff;
//红色背景
$color-orange: #ff7139;
//灰色
$color-gray: #dddddd;
//辅助绿色
$color-green: #25bf3b;
//辅助绿色
$color-pink: #ef2765;
//线框色
$color-line: #d9d9d9;

//激活
$color-text-active: #0f265b;
//一级标题
$color-text-l: #333333;
//二级标题
$color-text-m: #666666;
//三级标题
$color-text-s: #999999;
//白色
$color-text-white: #ffffff;
//App主体系
$color-text-theme: #29C352;
//一级标题
$color-text-red: #b62639;
//背景色//
.bg-theme {
  background: $color-theme !important;
}

.bg-background {
  background: $color-background !important;
}

.bg-white {
  background: $color-white !important;
}

.bg-line {
  background: $color-line !important;
}

.bg-red {
  background: $color-red !important;
}

.bg-orange {
  background: $color-orange !important;
}

//字体颜色//
.color-theme {
  color: $color-theme !important;
}

.color-background {
  color: $color-background !important;
}

.color-white {
  color: $color-white !important;
}

.color-line {
  color: $color-line !important;
}

.color-text-l {
  color: $color-text-l !important;
}

.color-text-m {
  color: $color-text-m !important;
}

.color-text-s {
  color: $color-text-s !important;
}

.color-text-white {
  color: $color-text-white !important;
}

.color-text-theme {
  color: $color-text-theme !important;
}

.color-text-red {
  color: $color-text-red !important;
}

.color-text-orange {
  color: $color-orange !important;
}

.color-text-green {
  color: $color-green !important;
}

//字体大小
.font-size-t {
  font-size: 8px !important;
}

.font-size-s {
  font-size: 12px !important;
}

.font-size-m {
  font-size: 14px !important;
}

.font-size-l {
  font-size: 18px !important;
}

.font-size-h {
  font-size: 22px !important;
}

.font-size-icon {
  font-size: 28px !important;
}

//常用间距
$margin-1: 1px;
$margin-2: 2px;
$margin-5: 5px;
$margin-10: 10px;
$margin-15: 15px;
$margin-20: 20px;
$margin-25: 25px;
$margin-30: 30px;
$margin-35: 35px;
$margin-40: 40px;
$margin-45: 45px;
$margin-50: 50px;
$margin-60: 60px;
$margin-70: 70px;
$margin-80: 80px;
$margin-90: 90px;
$margin-100: 100px;
$margin-150: 150px;
$margin-200: 200px;
$margin-500: 500px;
//字体
$font-family: 'Microsoft Yahei';

//宽高
.width-auto {
  width: auto
}

.width-10 {
  width: 10%
}

.width-20 {
  width: 20%
}

.width-25 {
  width: 25%
}

.width-30 {
  width: 30%
}

.width-33 {
  width: 33%
}

.width-40 {
  width: 40%
}

.width-50 {
  width: 50%
}

.width-60 {
  width: 60%
}

.width-70 {
  width: 70%
}

.width-80 {
  width: 80%
}

.width-90 {
  width: 90%
}

.width-100 {
  width: 100%
}

.width-80px {
  width: 80px
}

.width-100px {
  width: 100px
}

.width-min-100 {
  min-width: 100%;
}

.height-100 {
  height: 100%
}

.height-100px {
  height: 100px
}

.height-auto {
  height: auto !important;
}

.height-min-100 {
  min-height: 100px !important;
}

.height-min-140 {
  min-height: 140px !important;
}

.height-min-50 {
  min-height: 50px !important;
}

//绝对/相对布局
.bottom-0 {
  bottom: 0
}

.bottom-10 {
  bottom: $margin-10 !important
}

.bottom-15 {
  bottom: $margin-15 !important
}

.bottom-20 {
  bottom: $margin-20 !important
}

.bottom-30 {
  bottom: $margin-30 !important
}

.bottom-40 {
  bottom: $margin-40 !important
}

.top-0 {
  top: 0
}

.top-5 {
  top: $margin-5
}

.top--5 {
  top: -$margin-5
}

.top-10 {
  top: $margin-10
}

.top--10 {
  top: -$margin-10
}

.top-15 {
  top: $margin-15
}

.top-20 {
  top: $margin-20
}

.top-25 {
  top: $margin-25
}

.top-30 {
  top: $margin-30
}

.top-50 {
  top: 50%
}

.right-0 {
  right: 0
}

.right-5 {
  right: $margin-5
}

.right-10 {
  right: $margin-10
}

.right-15 {
  right: $margin-15
}

.right-20 {
  right: $margin-20
}

.left-0 {
  left: 0
}

.left-5 {
  left: $margin-5
}

.left-10 {
  left: $margin-10
}

.left-15 {
  left: $margin-15
}

.left-20 {
  left: $margin-20
}

.left-50 {
  left: 50%
}

.left-60 {
  left: 60%
}

.left-75 {
  left: 75%
}

//margin样式//
.margin-0 {
  margin: 0 !important;
}

.margin-5 {
  margin: $margin-5 !important;
}

.margin-10 {
  margin: $margin-10 !important;
}

.margin-15 {
  margin: $margin-15 !important;
}

.margin-20 {
  margin: $margin-20 !important;
}

.margin-right-0 {
  margin-right: 0 !important;
}

.margin-right-1 {
  margin-right: $margin-1 !important;
}

.margin-right-5 {
  margin-right: $margin-5 !important;
}

.margin-right-10 {
  margin-right: $margin-10 !important;
}

.margin-right-15 {
  margin-right: $margin-15 !important;
}

.margin-right-20 {
  margin-right: $margin-20 !important;
}

.margin-left-0 {
  margin-left: 0 !important;
}

.margin-left-5 {
  margin-left: $margin-5 !important;
}

.margin-left-10 {
  margin-left: $margin-10 !important;
}

.margin-left-15 {
  margin-left: $margin-15 !important;
}

.margin-left-20 {
  margin-left: $margin-20 !important;
}

.margin-top-0 {
  margin-top: 0 !important;
}

.margin-top-1 {
  margin-top: 1px !important;
}

.margin-top-5 {
  margin-top: $margin-5 !important;
}

.margin-top--5 {
  margin-top: -$margin-5 !important;
}

.margin-top-10 {
  margin-top: $margin-10 !important;
}

.margin-top--10 {
  margin-top: -$margin-10 !important;
}

.margin-top-15 {
  margin-top: $margin-15 !important;
}

.margin-top--15 {
  margin-top: -$margin-15 !important;
}

.margin-top-20 {
  margin-top: $margin-20 !important;
}

.margin-top--20 {
  margin-top: -$margin-20 !important;
}

.margin-top-25 {
  margin-top: $margin-25 !important;
}

.margin-top--25 {
  margin-top: -$margin-25 !important;
}

.margin-bottom-0 {
  margin-bottom: 0 !important;
}

.margin-bottom-1 {
  margin-bottom: $margin-1 !important;
}

.margin-bottom-5 {
  margin-bottom: $margin-5 !important;
}

.margin-bottom-10 {
  margin-bottom: $margin-10 !important;
}

.margin-bottom-15 {
  margin-bottom: $margin-15 !important;
}

.margin-bottom-20 {
  margin-bottom: $margin-20 !important;
}

.margin-bottom-25 {
  margin-bottom: $margin-25 !important;
}

.margin-bottom-30 {
  margin-bottom: $margin-30 !important;
}

.margin-bottom-35 {
  margin-bottom: $margin-35 !important;
}

.margin-bottom-70 {
  margin-bottom: $margin-70 !important;
}

.margin-bottom-80 {
  margin-bottom: $margin-80 !important;
}

.margin-bottom-100 {
  margin-bottom: $margin-100 !important;
}

.margin-top-bottom-0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.margin-top-bottom-5 {
  margin-top: $margin-5 !important;
  margin-bottom: $margin-5 !important;
}

.margin-top-bottom-10 {
  margin-top: $margin-10 !important;
  margin-bottom: $margin-10 !important;
}

.margin-top-bottom-15 {
  margin-top: $margin-15 !important;
  margin-bottom: $margin-15 !important;
}

.margin-top-bottom-20 {
  margin-top: $margin-20 !important;
  margin-bottom: $margin-20 !important;
}

.margin-left-right-0 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.margin-left-right-5 {
  margin-left: $margin-5 !important;
  margin-right: $margin-5 !important;
}

.margin-left-right-10 {
  margin-left: $margin-10 !important;
  margin-right: $margin-10 !important;
}

.margin-left-right-15 {
  margin-left: $margin-15 !important;
  margin-right: $margin-15 !important;
}

.margin-left-right-20 {
  margin-left: $margin-20 !important;
  margin-right: $margin-20 !important;
}

//padding样式//
.padding-0 {
  padding: 0 !important;
}

.padding-5 {
  padding: $margin-5 !important;
}

.padding-10 {
  padding: $margin-10 !important;
}

.padding-15 {
  padding: $margin-15 !important;
}

.padding-20 {
  padding: $margin-20 !important;
}

.padding-25 {
  padding: $margin-25 !important;
}

.padding-right-0 {
  padding-right: 0 !important;
}

.padding-right-5 {
  padding-right: $margin-5 !important;
}

.padding-right-10 {
  padding-right: $margin-10 !important;
}

.padding-right-15 {
  padding-right: $margin-15 !important;
}

.padding-right-20 {
  padding-right: $margin-20 !important;
}

.padding-right-25 {
  padding-right: $margin-25 !important;
}

.padding-right-30 {
  padding-right: $margin-30 !important;
}

.padding-left-0 {
  padding-left: 0 !important;
}

.padding-left-5 {
  padding-left: $margin-5 !important;
}

.padding-left-10 {
  padding-left: $margin-10 !important;
}

.padding-left-15 {
  padding-left: $margin-15 !important;
}

.padding-left-20 {
  padding-left: $margin-20 !important;
}

.padding-left-25 {
  padding-left: $margin-25 !important;
}

.padding-left-30 {
  padding-left: $margin-30 !important;
}

.padding-top-0 {
  padding-top: 0 !important;
}

.padding-top-5 {
  padding-top: $margin-5 !important;
}

.padding-top-10 {
  padding-top: $margin-10 !important;
}

.padding-top-15 {
  padding-top: $margin-15 !important;
}

.padding-top-20 {
  padding-top: $margin-20 !important;
}

.padding-top-25 {
  padding-top: $margin-25 !important;
}

.padding-top-30 {
  padding-top: 30% !important;
}

.padding-bottom-0 {
  padding-bottom: 0 !important;
}

.padding-bottom-5 {
  padding-bottom: $margin-5 !important;
}

.padding-bottom-10 {
  padding-bottom: $margin-10 !important;
}

.padding-bottom-15 {
  padding-bottom: $margin-15 !important;
}

.padding-bottom-20 {
  padding-bottom: $margin-20 !important;
}

.padding-bottom-25 {
  padding-bottom: $margin-15+$margin-10 !important;
}

.padding-top-bottom-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.padding-top-bottom-5 {
  padding-top: $margin-5 !important;
  padding-bottom: $margin-5 !important;
}

.padding-top-bottom-10 {
  padding-top: $margin-10 !important;
  padding-bottom: $margin-10 !important;
}

.padding-top-bottom-15 {
  padding-top: $margin-15 !important;
  padding-bottom: $margin-15 !important;
}

.padding-top-bottom-20 {
  padding-top: $margin-20 !important;
  padding-bottom: $margin-20 !important;
}

.padding-left-right-0 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.padding-left-right-5 {
  padding-left: $margin-5 !important;
  padding-right: $margin-5 !important;
}

.padding-left-right-10 {
  padding-left: $margin-10 !important;
  padding-right: $margin-10 !important;
}

.padding-left-right-15 {
  padding-left: $margin-15 !important;
  padding-right: $margin-15 !important;
}

.padding-left-right-20 {
  padding-left: $margin-20 !important;
  padding-right: $margin-20 !important;
}

.padding-left-right-25 {
  padding-left: $margin-25 !important;
  padding-right: $margin-25 !important;
}

//line-height
.line-heigt-0 {
  line-height: 0
}

//边框
.border {
  border: $margin-1 solid $color-line !important;
}

.border-top {
  border-top: $margin-1 solid $color-line !important;
}

.border-bottom {
  border-bottom: $margin-1 solid $color-line !important;
}

.border-bottom-active {
  border-bottom: $margin-2 solid $color-theme !important;
}

.border-left {
  border-left: $margin-1 solid $color-line !important;
}

.border-right {
  border-right: $margin-1 solid $color-line !important;
}

.border-left-right {
  border-left: $margin-1 solid $color-line !important;
  border-right: $margin-1 solid $color-line !important;
}

.border-top-bottom {
  border-top: $margin-1 solid $color-line !important;
  border-bottom: $margin-1 solid $color-line !important;
}

//圆角
.border-radius {
  -webkit-border-radius: $margin-5;
  -moz-border-radius: $margin-5;
  -ms-border-radius: $margin-5;
  border-radius: $margin-5;
}

//圆
.border-radius-100 {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -ms-border-radius: 100%;
  border-radius: 100%;
}

//边框
.border-none {
  border: none !important;
}

.border-top-none {
  border-top: none !important;
}

.border-bottom-none {
  border-bottom: none !important;
}

.border-left-right-none {
  border-left: none !important;
  border-right: none !important;
}

.border-top-bottom-none {
  border-top: none !important;
  border-bottom: none !important;
}

//浮动
.float-l {
  float: left;
}

.float-r {
  float: right;
}

//块元素水平居中
.horizontal-center {
  margin: 0 auto;
}

//字体对齐
.text-align-c {
  text-align: center;
}

.text-align-l {
  text-align: left;
}

.text-align-r {
  text-align: right;
}

.text-align-j {
  text-align: justify;
}

//字体加粗//
.font-bold {
  font-weight: bold;
}

//显示//
.inline-block {
  display: inline-block !important;
}

.inline {
  display: inline !important;
}

.block {
  display: block;
}

.none {
  display: none;
}

//定位
.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.fixed {
  position: fixed;
}

//溢出元素框时，内容会被修剪，并且其余内容是不可见的
.overflow-h {
  overflow: hidden;
}

//水平线
.line-level {
  height: $margin-1;
  width: 100%;
  background: $color-line;
  overflow: hidden;
}

//中横线
.text-decoration {
  text-decoration: line-through;
}

//首行缩进
.indent {
  text-indent: 2rem;
}

//段落文字换行
.white-space-normal {
  white-space: normal !important;
  word-wrap: break-word !important;
  word-break: break-all !important;
}

//段落文字不换行
.white-space-nowrap {
  white-space: nowrap !important;
}

//层叠覆盖
.front {
  z-index: 10;
}

.back {
  z-index: 1;
}

//黄金分割0.618  0.382
.col-43 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 42.8%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 42.8%;
  -ms-flex: 0 0 42.8%;
  flex: 0 0 42.8%;
  max-width: 42.8%;
}

.backdrop.active {
  opacity: 0.3;
  filter: alpha(opacity=10);
}

/*//下拉先择控件
.select-widget {
  display: inline-block;
  min-width: 6rem;
  border: solid 1px #999999;
  height: 1.5rem;
  position: relative;

  i {
    position: absolute;
    right: 10px;
    font-size: 20px
  }
}*/

.two-line-title {
  width: 100%;
  /*min-width: 10rem;*/
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  color: #333333;
  margin-bottom: 0.375rem;
}

textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] {
  -webkit-appearance: none; /*解决iphone safari上的圆角问题*/
}

input, button, select, textarea {
  font-family: $font-family;
}

//底背景色
html, body, .background {
  background: $color-background;
  font-family: $font-family;
}

/*

img {
  background: url("../img/sys_loading.svg");
}
*/
/**
 * Action Sheets for Android
 * --------------------------------------------------
 */
.platform-android .action-sheet-backdrop {
  -webkit-transition: background-color 150ms ease-in-out;
  transition: background-color 150ms ease-in-out;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 11;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0);
}

.platform-android .action-sheet-backdrop.active {
  background-color: rgba(0, 0, 0, 0.4);
}

.platform-android .action-sheet-wrapper {
  -webkit-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0);
  -webkit-transition: all cubic-bezier(0.36, 0.66, 0.04, 1) 500ms;
  transition: all cubic-bezier(0.36, 0.66, 0.04, 1) 500ms;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  max-width: 500px;
  margin: auto;
}

.platform-android .action-sheet-up {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.platform-android .action-sheet {
  margin-left: 8px;
  margin-right: 8px;
  width: auto;
  z-index: 11;
  overflow: hidden;
}

.platform-android .action-sheet .button {
  display: block;
  padding: 1px;
  width: 100%;
  border-radius: 0;
  border-color: #d1d3d6;
  background-color: transparent;
  color: #007aff;
}
.action-sheet .button {
  font-size: 14px;
}

.platform-android .action-sheet .button:hover {
  color: #007aff;
}

.platform-android .action-sheet .button.destructive {
  color: #ff3b30;
}

.platform-android .action-sheet .button.destructive:hover {
  color: #ff3b30;
}

.platform-android .action-sheet .button.active, .platform-android .action-sheet .button.activated {
  box-shadow: none;
  border-color: #d1d3d6;
  color: #007aff;
  background: #e4e5e7;
}

.platform-android .action-sheet-has-icons .icon {
  position: absolute;
  left: 16px;
}

.platform-android .action-sheet-title {
  padding: 16px;
  color: #8f8f8f;
  text-align: center;
  font-size: 13px;
}

.platform-android .action-sheet-group {
  margin-bottom: 8px;
  border-radius: 4px;
  background-color: #fff;
  overflow: hidden;
}

.platform-android .action-sheet-group .button {
  border-width: 1px 0px 0px 0px;
}

.platform-android .action-sheet-group .button:first-child:last-child {
  border-width: 0;
}

.platform-android .action-sheet-options {
  background: #f1f2f3;
}

.platform-android .action-sheet-cancel .button {
  font-weight: 500;
}

.platform-android .action-sheet-open {
  pointer-events: none;
}

.platform-android .action-sheet-open.modal-open .modal {
  pointer-events: none;
}

.platform-android .action-sheet-open .action-sheet-backdrop {
  pointer-events: auto;
}

.platform-android .action-sheet .action-sheet-title, .platform-android .action-sheet .button {
  text-align: center;
}

.platform-android .action-sheet-cancel {
  display: block;
}
.checkbox input:checked + .checkbox-icon:before{
  background: $color-theme;
  border-color: $color-theme;
}
.loading-container .loading {
  padding: 0;
  border-radius: 5px;
  background: none;
  color: #fff;
  text-align: center;
  text-overflow: ellipsis;
  font-size: 15px;
}
